import React from 'react'
import './Section.css'

class Section extends React.Component {
    render() {
        console.log(this.props)
        const {users,isFirst,isLoading,err} = this.props

        return (
            <div className="row">
                {
                    isFirst ? <h2>欢迎使用，输入关键字，随后点击搜索</h2> :
                    isLoading ? <h2>Loading.....</h2> :
                    err ? <h2 style = {{color:"red"}}>{err}</h2> :
                    users.map(item => {
                        return (
                            <div className="card" key={item.id}>
                                <a rel="noreferrer" href={item.html_url} target="_blank">
                                    <img alt="图片" src={item.avatar_url}
                                         style={{width: "100px"}}/>
                                </a>
                                <p className="card-text">{item.login}</p>
                            </div>
                        )
                    })
                }

            </div>
        )
    }
}

export default Section